<template>
    <view class="columnbox wdh-100 content">
        <view class="wdh-100 s-list">
            <view class="coupon-box one-store" v-for="(item,index) in arr" :key='index'>
                <image mode="aspectFill" class="store-img"
                    :src="item.goodsUrl">
                </image>
                <view class="s-title wdh-100 rowbox spb">{{item.goodsName}}
                    <view class="s-price">{{item.realIntegralPrice}}积分</view>
                </view>
                <view class="s-desc">兑换时间：{{item.createTime}}</view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
			pageNum:1,
			arr:[],
			total:10
            };
        },
		onLoad() {
			this.$modal.loading('加载中')
			this.getList();
		},
		onReachBottom(){
			if(this.arr.length == this.total){
				return false;
			}
			this.$modal.loading('加载中')
			this.pageNum++;
			this.getList();
		},
		methods:{
			getList(){
				let data = {
					// userId:uni.getStorageSync('userInfo').user.userId,
					pageSize:10,
					pageNum:this.pageNum
				}
				console.log(data)
				this.$req.get('/xcx/productUserOrder/list',data).then(res=>{
					this.$modal.closeLoading();
					if(res.data.code==200){
						this.arr = this.arr.concat(res.data.rows);
						this.total = res.data.total;
					}else{
						this.$modal.msg(res.data.msg);
					}
				})
			}
		}
		
    }
</script>

<style lang="scss" scoped>
    .content {
        background: #f7f8fa;
        min-height: 100vh;
        justify-content: flex-start;
        font-family: PingFang SC;
        width: 100%;
        overflow: hidden;
        padding: 20rpx 32rpx;
    }

    .s-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-top: 20rpx;

        .one-store {
            border-radius: 20rpx;
            width: 339rpx;
            background: #fff;
            overflow: hidden;
            margin-bottom: 20rpx;

            .store-img {
                border-radius: 20rpx;
                width: 100%;
                height: 220rpx;
            }
        }

        .s-title {
            font-size: 28rpx;
            padding: 10rpx 20rpx;
        }

        .s-price {
            color: #BD3124;
            font-size: 28rpx;
            margin-left: 20rpx;
        }

        .dh-btn {
            background: #17698F;
            color: #fff;
            font-size: 24rpx;
            padding: 10rpx 20rpx;
            line-height: 24rpx;
            margin-right: 20rpx;
            border-radius: 10rpx;
        }
    }

    .s-desc {
        font-size: 22rpx;
        color: #6C6C6C;
        padding: 10rpx 10rpx;
    }
</style>